<template>
    <div class="addProduct">
        <el-steps :active="product.active" align-center finish-status="success">
            <el-step title="填写商品信息" />
            <el-step title="填写商品促销" />
            <el-step title="填写商品属性" />
            <el-step title="选择商品关联" />
        </el-steps>
        <Content v-if="product.active == 0" />
        <Sale v-if="product.active == 1" />
        <Property v-if="product.active == 2" />
        <Relevance v-if="product.active == 3" />
    </div>
</template>

<script setup lang="ts">
import Content from '../../components/pms/addProduct/content.vue'
import Sale from '../../components/pms/addProduct/sale.vue'
import Property from '../../components/pms/addProduct/property.vue'
import Relevance from '../../components/pms/addProduct/relevance.vue'
import { useProductStore } from '../../stores/addProduct'
let product = useProductStore()
console.log(product.active);


</script>

<style scoped>
.addProduct {
    width: 800px;
    padding: 35px 35px 15px 35px;
    margin: 20px auto;
    border-radius: 4px;
    border: 1px solid #ebeef5;
    background-color: #fff;
    overflow: hidden;
    color: #303133;
    transition: .3s;
    margin-top: 60px;
    margin-bottom: 20px;
}
</style>